Практикум по разработке системы управления контентом (CMS)
Покупка
Новинка
Тематика:
Системы управления базами данных (СУБД)
Издательство:
ИНТУИТ
Автор:
Гутентог М. А.
Год издания: 2016
Кол-во страниц: 52
Дополнительно
Доступ онлайн
1 000 ₽
В корзину
Создание несложной системы управления сайтом на языках PHP, Javascript
Тематика:
ББК:
УДК:
ОКСО:
- ВО - Бакалавриат
- 09.03.01: Информатика и вычислительная техника
- 09.03.02: Информационные системы и технологии
- 09.03.03: Прикладная информатика
- 10.03.01: Информационная безопасность
- 38.03.05: Бизнес-информатика
- ВО - Магистратура
- 09.04.01: Информатика и вычислительная техника
- 09.04.02: Информационные системы и технологии
- 09.04.03: Прикладная информатика
- 10.04.01: Информационная безопасность
- 38.04.05: Бизнес-информатика
ГРНТИ:
Скопировать запись
Фрагмент текстового слоя документа размещен для индексирующих роботов.
Для полноценной работы с документом, пожалуйста, перейдите в
ридер.
Практикум по разработке системы управления контентом (CMS) 2-е издание, исправленное Гутентог М.А. Национальный Открытый Университет “ИНТУИТ” 2016 2
Практикум по разработке системы управления контентом (CMS)/ М.А. Гутентог - М.: Национальный Открытый Университет “ИНТУИТ”, 2016 Создание несложной системы управления сайтом на языках PHP, Javascript. (c) ООО “ИНТУИТ.РУ”, 2016-2016 (c) Гутентог М.А., 2016-2016 3
Обзор технологий. Начало кодирования Введение CMS – content management system, обычно переводится как “система управления содержимым (сайта)”. Возможно, вы слышали о таких широко распросранённых CMS, как Joomla, Битрикс. Создав собственную CMS, вы сможете понять, как работают другие, научитесь видеть их внутренние достоинства и недостатки. А несложные сайты (вроде блога с комментариями) вы сможете создавать прямо на своей CMS, которая позволит вам легко редактировать содержимое сайта, делать резервные копии, переносить файлы сайта и базу данных (БД) с одного хостинга на другой. Для работы вам понадобятся следующие инструменты: текстовый редактор с подсветкой синтаксиса: Notepad++ (на Windows), Kate или Geany (на Linux, MaxOS); Mysql-сервер; веб-сервер Apache с подключенным в виде модуля PHP; phpMyAdmin (ссылка: http://www.phpmyadmin.net/) для создания таблиц mysql; браузер Firefox. Вам не нужна будет громоздкая система разработки (IDE), весь код вашей CMS не превысит 100 килобайт (несколько файлов php, css, js). Веб-сервер и mysql-сервер вы можете установить сразу, используя для Windows такой дистрибутив, как USBWebserver V8 (ссылка: http://www.usbwebserver.net/en/download.php), а для Linux набор пакетов LAMP (MAMP, XAMP для MacOS). Если вы не сможете это сделать самостоятельно, используя компьютер и Интернет, вам, скорее всего, пока рано изучать данный курс. Курс рассчитан на людей, знакомых со спецификациями HTML5, CSS2 и с основами программирования на PHP, Javascript, с работой в phpMyAdmin и составлением простых sql-запросов. Нужны также будут начальные знания английского языка – чтобы с помощью словаря разбирать, что значит “affected rows”, “deprecated“, или “alter table files add primary key …”. HTML В мире веб существуют сотни CMS, фреймворков и прочих “библиотек”, и число их постоянно растёт. Потому что каждый человек, создавший хоть один сайт, обязательно задумается: нельзя ли в следующий раз избежать многочисленных трудов и создать новый сайт, взяв из старого сайта нечто существенное и слегка подправив? Что общего у блога, сайта доставки суши и сайта школьного расписания? Обнаружив это общее, мы сможем значительно ускорить создание следующего сайта (например, landing-page для продажи воздушных шариков). 4
Любой сайт состоит из html-страниц, это лежит на поверхности. Значит, общим будет некоторый набор html-тэгов. Большинство из них повторяются от одного сайта к другому: DOCTYPE, title, charset, link, script… То есть можно смело взять такой кусок текста (листинг 1.1 пример 1.1): <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Астрология</title> <link rel="stylesheet" href="site.css" type="text/css"> <script type="text/javascript" src="site.js"></script> </head> <body> <p><img src="files/img1.jpg" />Гадание по кофейной гуще</p> <p><img src="files/img2.jpg" />Оптом, в розницу и на экспорт</p> </body> Листинг 1.1. – и использовать его для создания любой страницы любого сайта, подставляя вместо слов “Астрология” и “Гадание по кофейной гуще” другие слова (и копируя на место картинок img1.jpg и img2.jpg другие файлы). В этом случае каждая страница сайта будет реально существующим html-файлом, и вы сможете менять этот текст, редактировать его. То есть это уже будет что-то вроде системы управления содержанием. Но работать в такой системе не очень удобно: править тексты вы сможете только в текстовом редакторе на своём компьютере – в Блокноте (или Notepad++); править текст надо будет очень аккуратно, чтобы не испортить окружающие html- тэги; чтобы изменить текст, вам нужно будет скачать нужный html-файл к себе на комьютер, отредактировать его, а потом загрузить обратно на сервер по ftp- протоколу (то есть не через браузер, а с помощью отдельной специальной программы). Идея CMS как раз в том и состоит, чтобы вы могли менять содержимое своего сайта, используя только браузер, без дополнительных программ и сложных манипуляций с файлами. Здесь возникает две разные задачи: Доступ к содержимому сервера через браузер. Удобное изменение текстов сайта без опасности повредить html-код. Для загрузки файлов на сервер используют html-формы. Браузер передаёт с помощью такой формы запрос, к которому присоединяет выбранный вами (на вашем 5
компьютере) файл. Запрос в соответствии с протоколом HTTP должен быть “POST“. Сервер без помощи специальных языков программирования (php, java, python) не сможет поместить отправленный вами файл в нужную папку. Теоретически существует ещё возможность отправлять на веб-сервер файлы методом PUT (которые, например, http-сервер Nginx может получать и распеределять по папкам самостоятельно, без использования Php), но такой возможности (отправлять файлы методом PUT) пока нет у самих html-форм, поэтому мы будем исходить только из использования метода POST. Это значит, что у работы на “чистом html” нет перспектив и нам сразу же понадобится php. А чтобы соединять разные тексты с одним и тем же повторяющимся фрагментом html, нужно будет хранить тексты отдельно от фрагментов html (называемых обычно шаблонами). Хранить тексты можно просто в отдельных файлах, но база данных (Mysql) намного удобнее. PHP, MySQL Листинг 1.1 пример 1.1 был достаточно прост, но дальше вам понадобится проверять работу каждого фрагмента кода в реальных условиях, отлаживать программу. Поэтому сразу создадим эти реальные условия (или убедимся, что они созданы). Если вы работаете на Windows, мы будем исходить из того, что вы установили USBWebserver и назначили для Apache порт 80; тогда в браузере вы сможете открыть ваш сайт по адресу ссылка: http://localhost/ (либо ссылка: http://localhost:8080/), а файлы для работы сайта (php, js, css) вы должны будете копировать в папку c:/usbws/root (или другую папку, в которую вы установили USBWebserver). Вместе с USBWebserver, кстати, должен сразу установиться phpMyAdmin. Если вы работаете под Линуксом, папка для вашего сайта, скорее всего, будет расположена по адресу /var/www/html (хотя, возможно, и в домашней директории пользователя – это будет зависеть от настроек веб-сервера), а phpMyAdmin вы должны будете установить самостоятельно (например, командой консоли sudo apt-get install phpmyadmin). Вся дальнейшая работа технически будет выглядеть так: 1. вы пишете что-то (например, программный код) в файлы php, js, css в папке вашего сайта; 2. открываете в браузере адрес ссылка: http://localhost/ (иногда ссылка: http://localhost/index2.php или index3.php) и смотрите, какие изменения произошли на сайте вследствие вашей работы с кодом; 3. корректируете код – и затем повторяете пункты 1 и 2 (и при необходимости 3 – пока не “заработает”). От этих двух добавлений (Php и Mysql) сложность кода начнёт возрастать по экспоненте. Минимальный повторяемый фрагмент страницы (“шаблон”) теперь будет 6
выглядеть так (листинг 1.2 пример 1.2):
<?php
$title = 'Астрология';
$img1 = 'img1.jpg';
$html1 = 'Гадание по кофейной гуще';
$img2 = 'img2.jpg';
$html2 = 'Гадание по кофейной гуще';
$page = <<<PAGE
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>{$title}</title>
<link rel="stylesheet" href="site.css" type="text/css">
<script type="text/javascript" src="site.js"></script>
</head>
<body>
<p><img src="files/{$img1}" />{$html1}</p>
<p><img src="files/{$img2}" />{$html1}</p>
</body>
PAGE;
print $page;
?>
Листинг 1.2.
А если использовать базу данных, тогда ещё сложнее (листинг 1.3 пример 1.3):
<?php
$id = $_GET['id'];
$link = mysqli_connect("localhost", "unsinn", "go68dbs", "unsinn");
$sql = "SELECT * FROM `mypages` where id = " . (int) $id;
$result = mysqli_query($link, $sql);
$row = mysqli_fetch_assoc($result);
$page = <<<PAGE
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>{$row['title']}</title>
<link rel="stylesheet" href="site.css" type="text/css">
<script type="text/javascript" src="site.js"></script>
</head>
<body>
<p><img src="files/{$row['img1']}" />{$row['html1']}</p>
<p><img src="files/{$row['img2']}" />{$row['html2']}</p>
</body>
PAGE;
print $page;
7
?>
Листинг 1.3.
Создайте в Папке сайта файл с именем index0.php и сохраните в этом файле
приведённый код. На нашем учебном хостинге он выглядит так: index0.php?code.
Обратите внимание на строчку:
$link = mysqli_connect("localhost", "unsinn", "go68dbs", "unsinn");
Слово “localhost” там правильное, обычно его менять не надо. А вот пользователя
“unsinn” с паролем “go68dbs” и БД “unsinn” вы должны будете создать на своём mysql-
сервере с помощью программы phpMyAdmin: откройте в браузере адрес, по которому
расположен phpMyAdmin (возможно, это будет ссылка: http://localhost/phpmyadmin/),
найдите там раздел для выполнения sql-запросов, скопируйте туда следующий текст и
выполните запрос (листинг 1.4 пример 1.4):
CREATE DATABASE IF NOT EXISTS `unsinn` ;
GRANT ALL PRIVILEGES ON `unsinn` . * TO 'unsinn'@'localhost' IDENTIFIED BY 'go68dbs';
flush PRIVILEGES;
Листинг 1.4.
И ещё мы должны создать в базе данных `unsinn` таблицу `mypages` со следующей
структурой (листинг 1.5 пример 1.5):
CREATE TABLE IF NOT EXISTS `mypages` (
`id` int(7) NOT NULL AUTO_INCREMENT,
`title` text NOT NULL,
`html1` text NOT NULL,
`html2` text NOT NULL,
`img1` varchar(99) NOT NULL,
`img2` varchar(99) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;
insert ignore into `mypages` (`id`, `title`, `html1`, `html2`, `img1`, `img2`) values
(1, 'Астрология', 'Гадание по кофейной гуще',
'Оптом, в розницу и на экспорт', 'img1.jpg', 'img2.jpg'),
(2, 'Воздушные шарики', 'Синие, белые и зелёные',
'Круглые, квадратные, треугольные', 'img1.jpg', 'img2.jpg');
Листинг 1.5.
Этот код надо также вставить в поле для sql-запросов в phpMyAdmin и выполнить
запрос. Сохраним этот код в файл source1.sql, чтобы потом не писать каждый раз код,
а просто ссылаться на этот файл (и вы тоже сохраните его у себя на компьютере).
Начала навигации. Первые ошибки в работе программы
8
Обратите внимание на строчку $id = $_GET[‘id’]; в файле index0.php. Эта строчка
рассчитана на то, что пользователь из браузера пошлёт на сервер запрос вида ссылка:
http://localhost/index0.php?id=3, а мы на сервере извлечём этот параметр (“3”) и
используем его для получения нужной строчки таблицы с помощью sql-запроса
(“SELECT * FROM `mypages` where id = 3”). То есть мы именно так пока организуем
связь запросов клиента и ответов сервера – через параметр id.
Размер нашего кода по сравнению с первоначальным чистым HTML вырос в 3-4 раза. Но
на вопрос, стоит ли оно того, здесь быстро ответить нельзя. Для начала надо немного
добавить реализма. На сайте редко бывает только одна страница (даже на казалось бы
единственной landing-page попросту собрано в кучу много разных страниц). Начнём с
двадцати (как будто бы у нас на сайте по астрологии 20 разных страниц). Тогда
начальный html-код надо будет размножить на 20 файлов (то есть количество его
возрастёт в 20 раз), а последний php-фрагмент у нас находится в единственном файле
index0.php и все 20 страниц мы можем вызвать с помощью параметра в адресной
строке: ссылка: http://localhost/index0.php?id=12, ссылка: http://localhost/index0.php?
id=19. Налицо явная экономия, казалось бы.
Но вот с этого места и начинается “экспонента” сложностей. Наш Код в файле
index0.php в таком виде попросту не будет работать. Вам это утверждение может
показаться слишком сильным. Проверим.
1. При переходе по адресу ссылка: http://localhost/index0.php вы получите сообщение
Notice: Undefined index: id in /var/www/html/index0.php on line 2.
2. При переходе по адресам от ссылка: http://localhost/index0.php?id=1 до ссылка:
http://localhost/index0.php?id=20 вы будете видеть какую-то информацию (если вы
занесли в таблицу mypages 20 строк, как планировали) – возможно, это будут
“кракозябры” или вопросики из-за несоответствия кодировки.
3. При параметре id > 20 вы будете видеть пустую страницу (ссылка:
http://localhost/index0.php?id=21).
4. И да, во всех случаях вы будете видеть сообщение об ошибке, связанное с
установкой часового пояса (если у вас php не очень древний).
5. Или вы совсем не будете видеть сообщения об ошибках, а только пустую страницу
– что хуже всего в нашем случае.
Вот с последнего и начнём. В работе сайта желательно предусмотреть два состояния:
рабочее (для пользователей) и режим отладки. Пользователи не должны видеть всякие
notice. Заведём для переключения этого состояния переменную и в зависимости от её
значения будем отображать сообщения об ошибках; а для обработки “возражения 4.”
добавим часовой пояс по умолчанию (листинг 1.6 пример 1.6):
<?php
$debug = true;
error_reporting(E_ALL);
ini_set('log_errors', true);
ini_set('display_errors', $debug);
date_default_timezone_set('Asia/Yakutsk');
9
//...
?>
Листинг 1.6.
Добавьте этот код к первоначальному php-коду и сохраните в Папке сайта под именем
index1.php. Проверьте код, он должен выглядеть примерно так: ссылка:
http://nichtig.ru/index1.php?code. Чтобы при добавлении параметра “code” можно было
видеть php-код файла (вместо результата работы программы) мы использовали дальше
следующий фрагмент:
<?php
//...
if (array_key_exists('code', $_GET)) {
header('Content-Type: text/html; charset=UTF-8');
$code = file_get_contents(__FILE__);
highlight_string($code);
exit;
}
//...
?>
Это было самое простое. Дальше будет всё хуже и хуже. Каждый раз, когда вы
обращаетесь к переменной по её имени (например, к переменной $debug в конструкции
ini_set(‘display_errors’, $debug);), вы должны ожидать неприятностей разного рода:
1. переменная не существует;
2. тип переменной не соответствует ожидаемому;
3. значение переменной не соответствует ожидаемому диапазону.
Все эти случаи надо предусматривать и “обрабатывать” – закладывать в программу
возможность исправить ситуацию до такой степени, чтобы обычный пользователь
ничего не заподозрил (а думал, что так оно и планировалось), или доводить ситуацию
хотя бы до внятного сообщения об ошибке (в режиме debug).
Проблема 2 – одна из самых неприятных: в php действует “незаметное” приведение
типов к нужному (в данном месте кода), и программист быстро привыкает особо не
обращать внимания на типы, что иногда внезапно вылезает боком (например, при
попытке обратиться к элементу массива по индексу – $arr[1] – когда переменная $arr
не является массивом).
Проблема 1 уже встретилась нам при обращении к странице index1.php без параметра
(“Notice: Undefined index: id...”). Проблема 3 – при попытке вызвать страницу с id
> 20. Решение этих проблем не является тривиальным, так как зависит совсем не от
программиста. Как именно следует их решать, должен сказать владелец сайта, но он не
подозревает об этих проблемах, и возникает замкнутый круг, разорвать который можно
только путём долгих и мучительных переговоров – поэтому на большинстве сайтов эти
проблемы вообще не решаются никак (либо решаются путём банального отключения
10
Доступ онлайн
1 000 ₽
В корзину